<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <link rel="stylesheet" href="/w3css/4/w3.css" />
  <link rel="stylesheet" href="old-popup.css" />
</head>

<body>
  <main>
    <div class="w3-display-topright">
      <div style="display: flex">
        <div class="w3-hover-light-grey" id="btnPatreon" title="patreon" data-i18n-title="lblMakeDonation">
          <i class="gg-heart" style="scale: 0.85"></i>
        </div>
        <div class="w3-hover-light-grey" id="btnSwitchInterfaces" title="Switch between simple and complex interface"
          data-i18n-title="swapPopup">
          <i class="gg-swap"></i>
        </div>
      </div>
    </div>

    <label id="lblTranslate" class="" style="margin-right: 70px" data-i18n="lblTranslatePageInto">Translate page
      into?</label>
    <label id="lblTranslating" class="" style="margin-right: 30px" data-i18n="lblTranslating">Translating...</label>
    <label id="lblTranslated" class="" style="margin-right: 60px" data-i18n="lblPageTranslateInto">Page translated
      into</label>
    <label id="lblError" class="" style="margin-right: 30px" data-i18n="lblError">It was not possible to translate this
      page</label>
    <label id="lblTargetLanguage" class="" style="margin-right: 30px" data-i18n="lblTargetLanguage"
      data-i18n-ph-value="">Target language</label>
    <br />
    <div id="divAlwaysTranslateThisLang">
      <input id="cbAlwaysTranslateThisLang" class="w3-check" type="checkbox" />
      <label id="lblAlwaysTranslateThisLang" for="cbAlwaysTranslateThisLang" class="w3-small"
        data-i18n="lblAlwaysTranslate" data-i18n-ph-value="">Always translate from</label>
    </div>
    <select id="selectTargetLanguage" class="w3-select w3-padding-small w3-border w3-round" size>
      <optgroup name="recents" label="recents" data-i18n-label="msgRecents"></optgroup>
      <optgroup name="all" label="all" data-i18n-label="msgAll"></optgroup>
    </select>
    <div class="flex-container">
      <div id="divIconTranslateContainer" style="margin-left: 5px; margin-right: 25px">
        <div id="divIconTranslate" style="position: relative" title="Switch between translation services"
          data-i18n-title="swapTranslationService">
          <img id="iconTranslate" src="/icons/google-translate-32.png" class="w3-btn w3-hover-none" />
          <img id="iconSwap" src="/icons/swap-32.png" class="w3-btn w3-hover-none" />
        </div>
      </div>

      <div style="margin-left: auto">
        <button id="btnReset" class="w3-btn w3-padding-small w3-border w3-round w3-text-blue" data-i18n="btnReset">
          Reset
        </button>
        <button id="btnTranslate" class="w3-btn w3-padding-small w3-round w3-blue" data-i18n="btnTranslate">
          Translate
        </button>
        <button id="btnRestore" class="w3-btn w3-padding-small w3-border w3-round w3-text-blue" data-i18n="btnRestore">
          Show original
        </button>
        <button id="btnTryAgain" class="w3-btn w3-padding-small w3-border w3-round w3-text-blue"
          data-i18n="btnTryAgain">
          Try Again
        </button>
        <div id="btnOptionsDiv" style="position: relative; margin-left: 5px">
          <select id="btnOptions" class="w3-btn w3-padding-small w3-border w3-round" style="display: inline" size>
            <option value="options" selected disabled hidden>Options</option>
            <option value="changeLanguage" data-i18n="msgChooseAnotherLanguage">
              Choose another language
            </option>
            <option value="alwaysTranslateThisSite" data-i18n="btnAlwaysTranslate">
              Always translate this site
            </option>
            <option value="neverTranslateThisSite" data-i18n="btnNeverTranslate">
              Never translate this site
            </option>
            <option value="neverTranslateThisLanguage" data-i18n="btnNeverTranslateThisLanguage" style="display: none">
              Never translate this language
            </option>
            <optgroup label=""></optgroup>
            <option data-i18n="lblShowTranslateSelectedButton" value="showTranslateSelectedButton">
              Show the button to translate the selected text
            </option>
            <option data-i18n="lblShowOriginalTextWhenHovering" value="showOriginalTextWhenHovering">
              Show original text when hovering
            </option>
            <option data-i18n="lblShowTranslatedWhenHoveringThisSite" value="showTranslatedWhenHoveringThisSite">
              Show translation when hovering over this site
            </option>
            <option data-i18n="lblShowTranslatedWhenHoveringThisLang" data-i18n-ph-value=""
              value="showTranslatedWhenHoveringThisLang" hidden>
              Show translation when hovering over websites in
            </option>
            <optgroup label=""></optgroup>
            <option value="translateInExternalSite" data-i18n="btnOpenOnGoogleTranslate">
              Open in Google Translate
            </option>
            <option value="moreOptions" data-i18n="btnMoreOptions">
              More options
            </option>
            <option value="translatePDF" data-i18n="msgTranslatePDF">Translate PDF</option>
            <option value="donate" data-i18n="btnDonate">Donate</option>
          </select>
          <div id="btnOptionB" style="
                display: inline;
                position: absolute;
                top: -6px;
                left: 0;
                background-color: white;
              " class="pointerIgnore w3-btn w3-padding-small w3-border w3-round w3-text-blue" data-i18n="btnOptions">
            Options
          </div>
        </div>
      </div>
    </div>

    <div id="divShowTranslateSelectedButton" style="display: none;">
      <br>
      <input type="checkbox" class="w3-check" id="cbShowTranslateSelectedButton">
      <label for="cbShowTranslateSelectedButton" data-i18n="lblShowTranslateSelectedButton">Show the button to
        translate the selected text</label>
    </div>

    <div style="margin-right: 6px; margin-top: 20px;">
      <button data-i18n="msgImproveTranslation" id="btnImproveTranslation">Improve translation</button>
    </div>
  </main>

  <script src="/lib/polyfill.js"></script>
  <script src="/lib/checkedLastError.js"></script>
  <script src="/lib/stuff.js"></script>
  <script src="detect-pdf.js"></script>
  <script src="/lib/languages.js"></script>
  <script src="/lib/config.js"></script>
  <script src="/lib/i18n.js"></script>
  <script src="old-popup.js"></script>
</body>

</html>